<template>
  <a-form
    :form="form"
    :label-col="{ span: 5 }"
    :wrapper-col="{ span: 12 }"
    @submit="handleSubmit"
  >
    <a-form-item label="合约名称">
      <a-input
        allow-clear
        placeholder="请输入智能合约名称"
        v-decorator="[
          'contractName',
          {
            rules: [
              { required: true, message: '请输入智能合约名称!' },
            ],
          },
        ]"
      />
    </a-form-item>
    <a-form-item label="ABI">
      <a-textarea
        :autosize="{ minRows: 5, maxRows: 10 }"
        allow-clear
        placeholder="请输入abi代码"
        v-decorator="[
          'abi',
          {
            rules: [{ required: true, message: '请输入abi代码!' }],
          },
        ]"
      />
    </a-form-item>
    <a-form-item label="Binary">
      <a-textarea
        :autosize="{ minRows: 10, maxRows: 20 }"
        allow-clear
        placeholder="请输入binary代码"
        v-decorator="[
          'binary',
          {
            rules: [
              { required: true, message: '请输入binary代码!' },
            ],
          },
        ]"
      />
    </a-form-item>
    <a-form-item label="包名称">
      <a-input
        allow-clear
        placeholder="请输入包名称 com.adopapa.ethexplorer"
        v-decorator="[
          'packageName',
          {
            rules: [
              { required: true, message: 'Please input your package name!' },
            ],
          },
        ]"
      />
    </a-form-item>
    <!-- <a-form-item label="Gender">
      <a-select
        v-decorator="[
          'gender',
          {
            rules: [{ required: true, message: 'Please select your gender!' }],
          },
        ]"
        placeholder="Select a option and change input text above"
        @change="handleSelectChange"
      >
        <a-select-option value="male"> male </a-select-option>
        <a-select-option value="female"> female </a-select-option>
      </a-select>
    </a-form-item> -->
    <a-form-item :wrapper-col="{ span: 12, offset: 5 }">
      <a-button type="primary" html-type="submit" :disabled="submitting">
        代码生成
      </a-button>
    </a-form-item>
  </a-form>
</template>

<script>
import Constant from "../utils/Constant";
export default {
  data() {
    return {
      formLayout: "horizontal",
      form: this.$form.createForm(this, { name: "coordinated" }),
      abi: "",
      binary: "",
      contractName: "",
      submitting: false,
      javacode: null,
    };
  },
  methods: {
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log("Received values of form: ", values);
          console.log(this.form);

          this.generateJavaCode(values);
        }
      });
    },
    handleSelectChange(value) {
      console.log(value);
      this.form.setFieldsValue({
        note: `Hi, ${value === "male" ? "man" : "lady"}!`,
      });
    },
    generateJavaCode(formValues) {
      let url = Constant.CONTRACT_JAVA_CODE_URL;
      let params = {};
      params.abi = formValues.abi;
      params.binary = formValues.binary;
      params.contractName = formValues.contractName;
      params.packageName = formValues.packageName;

      this.submitting = true;
      this.$http.post(url, params).then(
        (resp) => {
          // console.log(resp);
          if (resp.data.code === "01") {
            this.javacode = resp.data.result;
            let fileName = formValues.contractName + ".java";
            let blob = new Blob([this.javacode], {
              type: "text/plain;charset=utf-8;",
            });
            if (window.navigator.msSaveBlob) {
              // FOR IE BROWSER
              navigator.msSaveBlob(blob, fileName);
            } else {
              // FOR OTHER BROWSERS
              let link = document.createElement("a");
              link.href = URL.createObjectURL(blob);
              link.style = "visibility:hidden";
              link.download = fileName;
              document.body.appendChild(link);
              link.click();
              document.body.removeChild(link);
            }
          } else {
            this.$message.error(resp.data.message);
          }
          this.submitting = false;
        },
        (err) => {
          console.log(err);
          this.submitting = false;
        }
      );
    },
  },
};
</script>
